export class CanvasUtil { 
    // 类作用域
    public ctx:any;
    constructor(_ctx:any) { 
        this.ctx = _ctx ;
    }  
    // 方法
//    disp(items:any):void { 
    
//     } 
    drawItems(itemList:any[]):void{
        for(var i=0;i<itemList.length;i++){
          this.drawItem(itemList[i]);
        }
      }

    drawItem(item:any) :void{
        switch(item.itemtype){
          case "rect":
            this.drawRect(item);
            break;
          case "line":
            this.drawline(item);
            break;
          case "circle":
            this.drawCircle(item);
            break;
          case 'switch':
            this.drawSwtich(item);
            break;
        }
      }
      drawRect(item:any):void{
          this.ctx.beginPath();
        this.ctx.rect(item.left,item.top,item.width,item.height);
      
        this.ctx.closePath()
        this.ctx.stroke();
      }
      drawline(item:any):void{
          this.ctx.beginPath();
          this.ctx.moveTo(item.left,item.top);
          this.ctx.lineTo(item.endleft,item.endtop);
      
        this.ctx.closePath()
        this.ctx.stroke();
      }
      drawCircle(item:any):void{
        this.ctx.beginPath();
        this.ctx.arc(item.left,item.top,item.radius,0, Math.PI * 2, false)

        this.ctx.closePath();
        this.ctx.stroke();
      }
      drawSwtich(item:any):void{
        var x=item.left;
        var y=item.top;
        var radius=5;
        var direct=item.direct;
        var dx=0;
        var dy=0;
        var rx=0;
        var ry=0;
        if(direct==1 || direct==3){
            dx=5;
            dy=0;
            rx=radius;
            ry=0;
        }else{
            dx=0;
            dy=5;
            rx=0
            ry=radius;
        }
        var subItems=[
            {
            itemtype:'line',
            top:y,
            left:x,
            endtop:y-dy,
            endleft:x-dx,
            width:1,
            color:'blue'
            },
            {
                itemtype:'circle',
                top:y-dy-ry,
                left:x-dx-rx,
                radius:radius,
                color:'blue'
            },
            {
                itemtype:'line',
                top:y,
                left:x,
                endtop:y+dy,
                endleft:x+dx,
                width:1,
                color:'blue'
            },
            {
                itemtype:'circle',
                top:y+dy+ry,
                left:x+dx+rx,
                radius:radius,
                color:'blue'
            },
      ];
      this.drawItems(subItems)
    }
    
}


